<template>
	<view style="height: 100%;">
		<view class="centent">
			<view class="newsnews" v-if="news>0">
				<view class="newscenter" @tap="tonewslist">
					<image :src="avatar" mode=""></image>
					<text>{{(news<99)? news:'99+'}}条新消息</text>
				</view>
			</view>
			<qizai9527-dynamic :id="'sub'+ item.id" v-for="(item,index) in list" :key="item.id" :imgList="item.image"
				:avatar="item.avatar" :name="item.nickname" :shenfen="item.guanxi" :publishTime="item.time"
				:content="item.content" :isLike="item.if_tags" :isGiveReward="item.isGiveReward"
				:likeNumber="item.tags_num" :bzr="item.if_bzr" :giveRewardNumber="item.giveRewardNumber"
				:chatNumber="item.review_num" :sourceShow="true" :did="item.id" :my="item.if_self"
				:if_video="item.if_video" :sourceTitle="sourceTitle" :sourceImg="sourceImg" :sourceAuthor="sourceAuthor"
				@clickUser="clickUser(item.id)" @clickFocus="clickFocus(index)"
				@clickThumbsup="clickThumbsup(item.id,item.if_tags,item.tags_num)"
				@clickGiveReward="clickGiveReward(item.id)" @clickChat="clickChat(item.id)"
				@clickSource="clickSource(id)" v-if="list.length>0">
			</qizai9527-dynamic>
			<movable-area class="banjiclass">
				<movable-view class="tuo" direction="all" out-of-bounds=true>
					<image @tap="tofabu" src="../../static/banjiclass.png" mode="" v-if="isLogin&& index!=2"></image>
				</movable-view>
			</movable-area>
			<!-- <view class="banjiclass" @tap="tofabu">			
					<image  src="../../static/banjiclass.png" mode=""></image>				
			</view> -->
			<kongyemian v-if="list.length<1" type="shujv" :isLoding="loding"></kongyemian>
		</view>

	</view>
</template>

<script>
	import {
		mapState,
		mapGetters,
		mapMutation,
		mapActions
	} from 'vuex';
	export default {
		computed: {
			...mapState({
				userInfo: state => state.user.userInfo,
				isLogin: state => state.user.isLogin
			})
		},
		data() {
			return {
				list: [],
				loding: true,
				index: 0,
				news: 0,
				avatar: '',
				pageid: 0


			}
		},
		methods: {
			tofabu() {
				uni.navigateTo({
					url: "../fabupengyou/fabupengyou"
				})
			},
			showbanjiquan() {
				this.loding = true
				this.$store
					.dispatch('showbanjiquan', {
						token: this.userInfo.token,
						class_id: uni.getStorageSync("class_id"),
						index: uni.getStorageSync("def"),
						openid: this.userInfo.openid,
						student_id: uni.getStorageSync("student_id") ? uni.getStorageSync("student_id") : 0
					})
					.then(res => {
						if (res.data.code == 1) {
							this.list = res.data.data.user_classring
							this.news = res.data.data.classring_notice.nums
							if (res.data.data.classring_notice.nums > 0) {
								this.avatar = res.data.data.classring_notice.avatar
							}
						} else {
							this.list = []
							uni.showToast({
								title: res.data.msg,
								icon: "none",
							})
						}

						this.loding = false

					});

			},

			// clickDynamic(e) {
			// 	console.log('childDynamic');
			// },
			// 点击用户信息
			clickUser(e) {
				// console.log(e);
				// console.log('childUser');
			},
			// 点击关注
			clickFocus(e) {
				this.list[e].isFocusOn = this.list[e].isFocusOn ? false : true;
				// console.log(e);
				// console.log('childUser');
			},
			// 点赞
			clickThumbsup(e, isLike, likeNumber) {
				this.$store
					.dispatch('showdainzan', {
						id: e,
						openid: this.userInfo.openid,
						index: isLike == 0 ? 1 : 0,
						sf_index: this.index,
						student_id: uni.getStorageSync("student_id") ? uni.getStorageSync("student_id") : 0
					})
					.then(res => {
						this.showbanjiquan()
						// this.isLike = res.data.data.if_tags
						// this.likeNumber = res.data.data.tags_num
						console.log(res)

					});

			},
			tonewslist() {
				uni.navigateTo({
					url: '../../pagesA/newslist/newslist'
				})
			},
			// 点击打赏
			clickGiveReward(e) {
				// console.log(e);
				// console.log('clickGiveReward');
			},
			// 点击聊天
			clickChat(e) {
				// console.log(e);
				// console.log('clickChat');
			},
			// 点击原连接
			clickSource(e) {
				// console.log(e);
			},
		},
		onLoad(data) {
			this.showbanjiquan()
		},
		onShow() {
			this.index = uni.getStorageSync("def")
			if (this.isLogin) {
				this.showbanjiquan()
			} else {
				uni.navigateTo({
					url: '../login/login'
				})
			}

			if (uni.getStorageSync("pageid")) {
				this.pageid = uni.getStorageSync("pageid")
				uni.createSelectorQuery().select('#sub' + this.pageid).boundingClientRect(function(res) {				
					uni.pageScrollTo({
						scrollTop: res.top,
						duration: 300,
						success: () => {
							uni.removeStorageSync("pageid")							
						}
				
					});
				}).exec()
			} else{
				this.pageid = 0
			}

			


		},
		onPullDownRefresh() {
			this.showbanjiquan()
			setTimeout(() => {
				uni.stopPullDownRefresh();
			}, 1500)

		}
	}
</script>

<style lang="less">
	page {
		height: 100%;
		background-color: #f4f4f4;
		box-sizing: border-box;

	}

	.centent {
		background-image: url(../../static/keding.png);
		background-size: 100% auto;
		background-repeat: no-repeat;
		width: 100%;
		height: 100%;

		.banjiclass {
			position: fixed;
			bottom: 200rpx;
			right: 100rpx;

			.tuo {
				width: 100rpx;
				height: 100rpx;

				image {
					width: 100rpx;
					height: 100rpx;


				}
			}

		}

		// .banjiclass {			
		// 	image {
		// 		width: 100rpx;
		// 		height: 100rpx;
		// 		position: fixed;
		// 		bottom: 200rpx;
		// 		right: 50rpx;

		// 	}


		// }
		.newsnews {
			width: 100%;
			height: 80rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			background-color: #fff;

			.newscenter {
				// width: 230rpx;
				height: 80%;
				background-color: #424242;
				font-size: 26rpx;
				display: flex;
				align-items: center;
				border-radius: 8rpx;
				color: #fff;
				padding: 0 20rpx;

				image {
					width: 50rpx;
					height: 50rpx;
					border-radius: 25rpx;
					margin-right: 10rpx;
				}
			}
		}

	}
</style>
